<template>
	<view class="myinvestDetail">
			<view class="headerWrap">
				<view class="header">
					<image class="uni-media-list-logo" :src="cover" mode="aspectFill"></image>
					<view class="uni-media-list-body">
						<view class="uni-media-list-text-top">{{title}}</view>
						<view class="progress">{{progress}}</view>
						<!-- <view class="time">{{time}}</view> -->
						<view class="uni-media-list-text-bottom">
							<text>{{num}}份</text>
							<text>￥{{orderMoney}}</text>
						</view>
					</view>
				</view>
			</view>
			<view class="order">
				<view class="orderTitle">
					<text>订单信息</text>
				</view>
				<view class="orderInfo">
					<view class="orderInfo_num">
						订单编号 :<text>{{orderNumber}}</text>
					</view>
					<view class="orderInfo_time">
						购买时间 : <text>{{time}}</text>
					</view>
					<view class="orderInfo_type">
						支付方式 : <text>{{payType}}</text>
					</view>
					<view class="orderInfo_status">
						订单收益 : <text :class="{green:!red,red:red,blue:blue}">{{profitValue}}</text>
					</view>
				</view>
			</view>
			<view class="order delivery" v-if="status == 'paid' || status == 'delivery' ||status == 'finish' ">
				<view class="orderTitle">
					<text>合同配送信息</text>
				</view>
				<view class="orderInfo" >
					<view class="orderInfo_num">
						<text>收货人 :</text><text>{{name}}</text>
					</view>
					<view class="orderInfo_time">
						<text>手机号 :</text><text>{{mobile}}</text>
					</view>
					<view class="orderInfo_address">
						<text>收货地址 :</text><text class="address">{{address}}</text>
					</view>
					<view class="orderInfo_type" v-if="expressName">
						<text>快递公司 :</text><text>{{expressName}}</text>
					</view>
					<view class="orderInfo_status" v-if="expressNumber">
						<text>运单号 :</text><text class="green">{{expressNumber}}</text>
					</view>
					<view v-if="!expressName">
						<text></text><text class="waitPost">等待合同邮寄</text>
					</view>
				</view>
			</view>
		</view>
</template>

<script>
	var util = require('../../common/util.js')
export default {
    data() {
        return {
            reload: false,
            red: false,
            blue: false,
            cover: '',
            name: '',
            address: '',
            title: '',
            profitValue: '',
            profit: 0,
            deposit: '',
            orderNumber: '',
            status: '',
            progress: '',
            mobile: '',
            time: '',
            num: 0,
            orderMoney: 0,
            expressNumber: '',
            payType: '',
            expressName: ''
        };
    },
    onLoad(option) {
        console.log(option.id);
        uni.showLoading({
            title: '正在加载...'
        });
        util.ajax(
            'orderDetail',
            {
                targetId: option.id,
                token: util.getUserToken(),
            },
            data => {
                uni.hideLoading();
                let json = data.data;
                if (json.status) {
                    console.log(json);

                    this.title = json.union.title;
                    this.cover = json.union.coverImage;
                    this.progress = json.union.releaseStatus.text;
                    this.time = this.formatTime(json.data.createTime);
										this.num = json.data.extra.number;
										this.orderMoney = util.showDecimal(json.data.extra.priceOfUnit * json.data.extra.number) ;
										this.payType = json.data.payType.text;
										this.orderNumber = json.orderNumber;
										this.status = json.data.status.value
										
										if(json.data.extra.profit){
											this.profit = json.data.extra.profit
										}else{
											this.profitValue = 0
										}
									console.log(this.profit)
										this.deposit = json.data.extra.deposit
										this.expressName = json.data.extra.expressName
										this.expressNumber = json.data.extra.expressNumber
										
									console.log(this.deposit)
// 										if(this.deposit===0){ //标准项目
// 												if(this.profit >0){
// 														this.profitValue = util.showDecimal(this.profit)  + '元'
// 												}else{
// 													this.profitValue = '等待收益发放'
// 												}
// 												
// 										}else{  //需要付订金的项目
// 												
// 											
// 										}
										if(this.status == 'paid'||this.status == 'delivery'){
											this.red = false
											this.profitValue = '等待收益发放'
										}
										if(this.status == 'tailConfirm'){
											this.profitValue = '等待支付尾款'
											this.payType = '线下支付(预付定金'+  util.showDecimal(this.deposit) +'元)'
										}
										if(this.status == 'expiredTailConfirm'){
											this.profitValue = '订单失效'
											this.red = true
											this.payType = '线下支付(预付定金'+ util.showDecimal(this.deposit) +'元，已退还至钱包)'
										}
										if(this.status == 'finish'){
											this.profitValue = util.showDecimal(this.profit)  + '元'
											if(this.profit >0){
												this.red = true
											}else{
												this.blue = true
											}
											
										}
										if(this.status == 'cancel'){
											this.profitValue = '订单已取消'
										}
										if(this.status == 'expired'){
											this.profitValue = '过期未支付'
										}
										if(this.status == 'expiredTailConfirm'){
											this.profitValue = '过期未付尾款'
										}
										
										this.address = json.data.extra.address
										this.name = json.data.extra.name
										this.mobile = json.data.extra.mobile

                }
            },
            (data, code) => {
                console.log(data);
                uni.showToast({
                    title: JSON.stringify(data.message),
                    icon: 'none',
                    duration: 1000
                });
            }
        );
    },
    onReachBottom() {
        // this.getList();
    },
    onPullDownRefresh() {
        this.reload = true;
        // this.getList();
    },
    methods: {
       formatTime(timstamp){
       	// console.log(this.lastOrder.createTime)
       	return util.parseTime(timstamp)
       },
    }
};
</script>

<style lang="less">
	.myinvestDetail .headerWrap .header .uni-media-list-logo{
		margin-right: 20upx;
	}
.myinvestDetail {
    width: 100%;
    background: #f4f4f4;
    flex-direction: column;

    .headerWrap {
        flex-direction: column;
        width: 100%;
        background: white;
        padding: 20upx 30upx;
        box-sizing: border-box;
        .header {
            .uni-media-list-logo {
               width: 180upx;
               height: 240upx;
               border-radius: 6upx;
							 margin-right: 20upx;
            }

            .uni-media-list-body {
                height: auto;
                // justify-content: space-around;
                .uni-media-list-text-top {
                    font-size: 32upx;
                    color: #000000;
										overflow: hidden;
                    font-weight: 600;
                }
                .progress {
                    background: #ff1268;
                    color: white;
                    border-radius: 50upx;
                    padding: 8upx 16upx;
										display: flex;
                    align-items: center;
                    justify-content: center;
                    font-size: 26upx;
										margin: 0 0 70upx;
                }
                .uni-media-list-text-bottom {
                    flex-direction: row;
                    justify-content: space-between;
                    color: #222222;
                    font-size: 30upx;
                    text:last-child {
                        font-size: 28upx;
                        color: #ff1268;
                    }
                }
            }
        }
    }
    .order {
        width: 100%;
        margin-top: 20upx;
        flex-direction: column;
        padding: 0 30upx;
        box-sizing: border-box;
        background: white;
        .orderTitle {
            height: 110upx;
            width: 100%;
            font-size: 30upx;
            color: #333333;
            align-items: center;
            border-bottom: 1upx solid #eeeeee;
        }

        .orderInfo {
            width: 100%;
            flex-direction: column;
            padding: 40upx 0;
						font-size: 28upx;
            view {
                font-size: 28upx;
                color: #999999;
                line-height: 68upx;
                text{
                    color: #111111;
                    margin-left: 20upx;
                }
            }
            .green {
                color: #1cc457;
            }
						.red {
                color:red;
            }
						.blue {
                color:blue;
            }
        }
    }
    .delivery {
        .orderInfo {
            view {
                text:first-child {
                    width: 20%;
                    color: #999999;
                    margin-left: 0;
                }
                text:last-child {
                    width: 80%;
                }
                .waitPost {
                    color: #999999;
                    line-height: 78upx;
                }
            }
        }
    }
}
</style>
